<template>
    <div class="info">
        <el-col :span="12" class="user_info">
            <el-card class="info_card" :body-style="{ padding: '0px' }">
                <img src="../../assets/img/login-bg-copy.jpg" class="img_user">
                <div class="info_user">
                    <el-table class="info_user" style="width:80%; margin:auto;" :data="userInfo">
                        <el-table-column label="员工编号" prop="userId" align="center">
                        </el-table-column>
                        <el-table-column label="员工姓名" prop="empName" align="center">
                        </el-table-column>
                        <el-table-column label="员工部门" prop="empDept" align="center">
                        </el-table-column>
                        <el-table-column label="员工职务" prop="empAuth" align="center">
                        </el-table-column>
                    </el-table>
                </div>
            </el-card>
        </el-col>
        <el-col :span="12" class="sum">
            
        </el-col>
    </div>
</template>

<script>
export default {
    data() {
        return {
            userInfo: [
                
            ]
        }
    },
    beforeRouteEnter(to, from, next) {
        console.log('to', to, 'from', from);
        next(vm => {
            vm.userInfo = [{
                    userId: vm.$store.state.username,
                    empName: vm.$store.state.emp_name,
                    empDept: vm.$store.state.dept_str[vm.$store.state.department_id],
                    empAuth: vm.$store.state.auth_str[vm.$store.state.auth]
                }]
        })
    }
}
</script>

<style>
.img_user{
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 5%;
    margin-bottom: 5%;
}
.info {
    height: 100%;
}
.info_user {
    width: 100%;
    margin-bottom: 5%;
}
.info_card {
    margin-top: 1%;
    margin-bottom: 5%;
    margin-left: 12%;
    margin-right: 5%;
}
</style>